<template>
	<view class="content">
		<u-sticky>
			<view class="search">
				<view class="formInput">
					<u-input placeholder="请输入"></u-input>
				</view>
				<u-image src="/static/img/home/scan.png" width="24" height="24"></u-image>
			</view>
		</u-sticky>
		<view class="products" ref="pro">
			<view class="items">
				<view class="item" v-for="item,index in products" :key="index">
					<view class="remarks">
						<u-checkbox></u-checkbox>
						<view>
							<u-image src="/static/img/logo.png" width="88" height="88"></u-image>
						</view>
						<view class="info">
							<text class="title">铜陵产品库</text>
							<text>备品编号</text>
							<text>备品型号</text>
							<text>备品分类</text>
							<text>所属仓库</text>
						</view>
					</view>
					
				</view>
			</view>
		</view>
		<view class="button">
			<view>
				<text>已（{{number}}）选择</text>
			</view>
			<view>
				<u-button text="确认选择" color="RGBA(39, 115, 239)" type="primary"></u-button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				products:[1,2,3,4,5,6,7],
				number:0,
			}
		},
		methods: {

		}
	}
</script>

<style lang="less">
	page {
		background-color: rgb(248, 248, 248);
		font-size: 24rpx;
	}

	.content {
		display: flex;
		flex-direction: column;
	}

	.search {
		display: flex;
		flex-direction: row;
		background-color: #fff;
		align-items: center;
		box-sizing: border-box;
		padding: 0 32rpx 8rpx 32rpx;
	}

	.formInput {
		display: flex;
		flex: 2;
		margin-right: 16rpx;
	}
	.products{
		display: flex;
		flex-direction: column;
		padding: 0 32rpx 0 32rpx;
		margin-bottom: 130rpx;
	}
	.items{
		display: flex;
		flex-direction: column;
	}
	.item{
		margin-top: 32rpx;
		padding: 32rpx;
		background-color: #fff;
		border-radius: 10rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
	.remarks{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.info{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		margin-left: 32rpx;
	}
	.title{
		font-weight: bold;
	}
	.button{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		box-sizing: border-box;
		background-color: #fff;
		padding: 0 32rpx;
		position: fixed;
		left: 0;
		bottom: 0;
		height: 96rpx;
		border-top: 2rpx solid rgb(204, 204, 204);
	}
</style>